$(document).ready(function(){
    getMessages();
});

function getMessages() {
    var jsonStr ='{ '+
        '"notifications":[' +
        '{"time":"2pm","title":"ttttttttttttttttttt","content":"23222222222","headClass":"bg-green","photo":"zmdi-trending-down"},' +
        '{"time":"4pm","title":"ttttwettttttt","content":"2eeerrrr22222","headClass":"bg-blue","photo":"zmdi-email"},' +
        '{"time":"5pm","title":"ttttwetttt","content":"2eeerddddddddddddddddddddddddddddddrrr22222","headClass":"sl-avatar","photo":"../frame/img/avatar.jpg"}' +
        '],' +
        '"latestProducts":[' +
        '{"name":"产品一","photo":"../frame/img/chair.jpg"},{"name":"产品三","photo":"../frame/img/chair.jpg"},{"name":"产品二","photo":"../frame/chair.jpg"},' +
        '],'+
        '"reCode":"40001"}';
    var jsonData=eval('(' + jsonStr + ')');
    var html='';
    if(jsonData.notifications.length>0){
        for (var i=0;i<jsonData.notifications.length;i++){
            html+='<div class="sl-item">'
                +'<a href="javascript:void(0)">';
            if("sl-avatar" != jsonData.notifications[i].headClass){
                html +='<div class="icon '+jsonData.notifications[i].headClass+'"><i class="zmdi '+jsonData.notifications[i].photo+'"></i></div>';
            }else{
                html +='<div class="'+jsonData.notifications[i].headClass+'"> <img class="img-responsive" src="'+jsonData.notifications[i].photo+'" alt="avatar"/></div>';
            }
            html +='<div class="sl-content">'
                +'<span class="inline-block capitalize-font  pull-left truncate head-notifications">'+jsonData.notifications[i].title+'</span>'
                +'<span class="inline-block font-11  pull-right notifications-time">'+jsonData.notifications[i].time+'</span>'
                +'<div class="clearfix"></div>'
                +'<p class="truncate">'+jsonData.notifications[i].content+'</p>'
                +'</div>'
                +'</a></div><hr class="light-grey-hr ma-0"/>';
        }
    }
    $("#messageNum").html(jsonData.notifications.length);
    $("#headMessage").html(html);
}